﻿<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="/static/css/bootstrap.min.css" rel="stylesheet">
    <title>首页</title>
</head>
<body class="container">
<div class="row">
    <div class="col-sm-6"><h4><span id="date">{{ date }}</span></h4></div>
    <div class="col-sm-6"><input type="checkbox" id="slider">滑屏</div>
</div>
<ul id="myTab" class="nav nav-tabs">
    <li class="active">
        <a href="#centralize" data-toggle="tab" id="tab_centralize">
            集中计数 집중 계수
        </a>
    </li>
    <li><a href="#discrete" data-toggle="tab" id="tab_discrete">分立计数 분립 계수</a></li>
</ul>
<div id="myTab" class="tab-content">
    {#Tab 标签1#}
    <div class="tab-pane fade in active" id="centralize">
        <div class="row">
            <div class="col-lg-6 col-md-6, col-sm-12">
                <table class="table table-condensed">
                    <caption><h4><span class="label label-info">工厂1</span></h4></caption>
                    <tr>
                        <th>工序</th>
                        <th>白班</th>
                        <th>夜班</th>
                        <th>总数</th>
                    </tr>
                    <tr>
                        <td><h4><a class="label label-primary" href="/pos/切帽/day/0/factory/1">F1切帽</a></h4></td>
                        <td><h4><span id="qm_11" class="text-muted">{{ qm_1[0] }}</span><br/><span
                                id="qm_1">{{ qm[0] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="qm_12" class="text-muted">{{ qm_1[1] }}</span><br/><span
                                id="qm_2">{{ qm[1] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="qm_10" class="text-muted">{{ qm_1[2] }}</span><br/><span
                                id="qm">{{ qm[2] }}</span>
                        </h4>
                        </td>
                    </tr>

                    <tr>
                        <td><h4><a class="label label-primary" href="/pos/加工/day/0/factory/1">F1加工</a></h4></td>
                        <td><h4><span id="jg_11" class="text-muted">{{ jg_1[0] }}</span><br/><span
                                id="jg_1">{{ jg[0] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="jg_12" class="text-muted">{{ jg_1[1] }}</span><br/><span
                                id="jg_2">{{ jg[1] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="jg_10" class="text-muted">{{ jg_1[2] }}</span><br/><span
                                id="jg">{{ jg[2] }}</span>
                        </h4>
                        </td>
                    </tr>
                    <tr>
                        <td><h4><a class="label label-primary" href="/pos/正面/day/0/factory/1">F1正面</a></h4></td>
                        <td><h4><span id="zm_11" class="text-muted">{{ zm_1[0] }}</span><br/><span
                                id="zm_1">{{ zm[0] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="zm_11" class="text-muted">{{ zm_1[1] }}</span><br/><span
                                id="zm_2">{{ zm[1] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="zm_10" class="text-muted">{{ zm_1[2] }}</span><br/><span
                                id="zm">{{ zm[2] }}</span>
                        </h4>
                        </td>
                    </tr>
                    <tr>
                        <td><h4><a class="label label-primary" href="/pos/涂装半成品/day/0/factory/1">F1涂装半成品</a></h4></td>
                        <td><h4><span id="tb_11" class="text-muted">{{ tb_1[0] }}</span><br/><span
                                id="tb_1">{{ tb[0] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="tb_12" class="text-muted">{{ tb_1[1] }}</span><br/><span
                                id="tb_2">{{ tb[1] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="tb_10" class="text-muted">{{ tb_1[2] }}</span><br/><span
                                id="tb">{{ tb[2] }}</span>
                        </h4>
                        </td>
                    </tr>
                    <tr>
                        <td><h4><a class="label label-primary" href="/pos/涂装成品/day/0/factory/1">F1涂装成品</a></h4></td>
                        <td><h4><span id="tc_11" class="text-muted">{{ tc_1[0] }}</span><br/><span
                                id="tc_1">{{ tc[0] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="tc_12" class="text-muted">{{ tc_1[1] }}</span><br/><span
                                id="tc_2">{{ tc[1] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="tc_10" class="text-muted">{{ tc_1[2] }}</span><br/><span
                                id="tc">{{ tc[2] }}</span>
                        </h4>
                        </td>
                    </tr>
                    <tr>
                        <td><h4><a class="label label-primary" href="/pos/亚克力入口/day/0/factory/1">F1亚克力入口</a></h4></td>
                        <td><h4><span id="yr_11" class="text-muted">{{ yr_1[0] }}</span><br/><span
                                id="yr_1">{{ yr[0] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="yr_12" class="text-muted">{{ yr_1[1] }}</span><br/><span
                                id="yr_2">{{ yr[1] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="yr_10" class="text-muted">{{ yr_1[2] }}</span><br/><span
                                id="yr">{{ yr[2] }}</span>
                        </h4>
                        </td>
                    </tr>
                    <tr>
                        <td><h4><a class="label label-primary" href="/pos/亚克力出口/day/0/factory/1">F1亚克力出口</a></h4></td>
                        <td><h4><span id="yc_11" class="text-muted">{{ yc_1[0] }}</span><br/><span
                                id="yc_1">{{ yc[0] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="yc_12" class="text-muted">{{ yc_1[1] }}</span><br/><span
                                id="yc_2">{{ yc[1] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="yc_10" class="text-muted">{{ yc_1[2] }}</span><br/><span
                                id="yc">{{ yc[2] }}</span>
                        </h4>
                        </td>
                    </tr>
                </table>
            </div>
            {#工厂2#}
            <div class="col-lg-6 col-md-6, col-sm-12">
                <table class="table table-condensed">
                    <caption><h4><span class="label label-info">工厂2</span></h4></caption>
                    <tr>
                        <th>工序</th>
                        <th>白班</th>
                        <th>夜班</th>
                        <th>总数</th>
                    </tr>
                    {# F2旋压#}
                    <tr>
                        <td><h4><a class="label label-success" href="/pos/旋压/day/0/factory/2">F2旋压</a></h4></td>
                        <td><h4><span id="f2_xy_11" class="text-muted">{{ f2_yesterday['xy_1'][0] }}</span><br/><span
                                id="f2_xy_1">{{ f2_today['xy'][0] }}</span></h4>
                        </td>
                        <td><h4><span id="f2_xy_12" class="text-muted">{{ f2_yesterday['xy_1'][1] }}</span><br/><span
                                id="f2_xy_2">{{ f2_today['xy'][1] }}</span></h4>
                        </td>
                        <td><h4><span id="f2_xy_10" class="text-muted">{{ f2_yesterday['xy_1'][2] }}</span><br/><span
                                id="f2_xy">{{ f2_today['xy'][2] }}</span>
                        </h4></td>
                    </tr>
                    {# F2加工#}
                    <tr>
                        <td><h4><a class="label label-success" href="/pos/加工/day/0/factory/2">F2加工</a></h4></td>
                        <td><h4><span id="f2_jg_11" class="text-muted">{{ f2_yesterday['jg_1'][0] }}</span><br/><span
                                id="f2_jg_1">{{ f2_today['jg'][0] }}</span></h4>
                        </td>
                        <td><h4><span id="f2_jg_12" class="text-muted">{{ f2_yesterday['jg_1'][1] }}</span><br/><span
                                id="f2_jg_2">{{ f2_today['jg'][1] }}</span></h4>
                        </td>
                        <td><h4><span id="f2_jg_10" class="text-muted">{{ f2_yesterday['jg_1'][2] }}</span><br/><span
                                id="f2_jg">{{ f2_today['jg'][2] }}</span>
                        </h4></td>
                    </tr>
                    {# F2涂装#}
                    <tr>
                        <td><h4><a class="label label-success" href="/pos/涂装成品/day/0/factory/2">F2涂装成品</a></h4></td>
                        <td><h4><span id="f2_tc_11" class="text-muted">{{ f2_yesterday['tc_1'][0] }}</span><br/><span
                                id="f2_tc_1">{{ f2_today['tc'][0] }}</span></h4>
                        </td>
                        <td><h4><span id="f2_tc_12" class="text-muted">{{ f2_yesterday['tc_1'][1] }}</span><br/><span
                                id="f2_tc_2">{{ f2_today['tc'][1] }}</span></h4>
                        </td>
                        <td><h4><span id="f2_tc_10" class="text-muted">{{ f2_yesterday['tc_1'][2] }}</span><br/><span
                                id="f2_tc">{{ f2_today['tc'][2] }}</span>
                        </h4></td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
    {#  --------------------------------------------------分割线-------------------------------------------------------- #}
    {#    标签2#}
    <div class="tab-pane fade" id="discrete">
        {#分立计数#}
        <div class="row">
            <div class="col-lg-6 col-md-6, col-sm-12">
                <table class="table table-condensed">
                    <caption><h4><span class="label label-info">分立计数：工厂1</span></h4></caption>
                    <tr>
                        <th>工序</th>
                        <th>白班</th>
                        <th>夜班</th>
                        <th>总数</th>
                    </tr>
                    {# F1铸造 1线#}
                    <tr>
                        <td><h4><a class="label label-primary" href="/pos/铸造1线/day/0/factory/1">F1铸造1线出口</a></h4></td>
                        <td><h4><span id="zz1_11" class="text-muted">{{ zz1_1[0] }}</span><br/><span
                                id="zz1_1">{{ zz1[0] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="zz1_12" class="text-muted">{{ zz1_1[1] }}</span><br/><span
                                id="zz1_2">{{ zz1[1] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="zz1_10" class="text-muted">{{ zz1_1[2] }}</span><br/><span
                                id="zz1">{{ zz1[2] }}</span>
                        </h4>
                        </td>
                    </tr>
                    {# F1铸造 2线#}
                    <tr>
                        <td><h4><a class="label label-primary" href="/pos/铸造2线/day/0/factory/1">F1铸造2线出口</a></h4></td>
                        <td><h4><span id="zz2_11" class="text-muted">{{ zz2_1[0] }}</span><br/><span
                                id="zz2_1">{{ zz2[0] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="zz2_12" class="text-muted">{{ zz2_1[1] }}</span><br/><span
                                id="zz2_2">{{ zz2[1] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="zz2_10" class="text-muted">{{ zz2_1[2] }}</span><br/><span
                                id="zz2">{{ zz2[2] }}</span>
                        </h4>
                        </td>
                    </tr>
                    {# F1铸造 2线边浇#}
                    <tr>
                        <td><h4><a class="label label-primary" href="/pos/铸造2线边浇/day/0/factory/1">F1铸造2线边浇</a></h4></td>
                        <td><h4><span id="zz3_11" class="text-muted">{{ zz3_1[0] }}</span><br/><span
                                id="zz3_1">{{ zz3[0] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="zz3_12" class="text-muted">{{ zz3_1[1] }}</span><br/><span
                                id="zz3_2">{{ zz3[1] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="zz3_10" class="text-muted">{{ zz3_1[2] }}</span><br/><span
                                id="zz3">{{ zz3[2] }}</span>
                        </h4>
                        </td>
                    </tr>
                    {# F1 热处理1#}
                    <tr>
                        <td><h4><a class="label label-primary" href="/pos/热处理1线/day/0/factory/1">F1热处理1线入口</a></h4></td>
                        <td><h4><span id="re1_11" class="text-muted">{{ re1_1[0] }}</span><br/><span
                                id="re1_1">{{ yc[0] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="re1_12" class="text-muted">{{ re1_1[1] }}</span><br/><span
                                id="re1_2">{{ yc[1] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="re1_10" class="text-muted">{{ re1_1[2] }}</span><br/><span
                                id="re1">{{ yc[2] }}</span>
                        </h4>
                        </td>
                    </tr>
                    {# F1 热处理2#}
                    <tr>
                        <td><h4><a class="label label-primary" href="/pos/热处理2线/day/0/factory/1">F1热处理2线入口</a></h4></td>
                        <td><h4><span id="re2_11" class="text-muted">{{ re2_1[0] }}</span><br/><span
                                id="re2_1">{{ yc[0] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="re2_12" class="text-muted">{{ re2_1[1] }}</span><br/><span
                                id="re2_2">{{ yc[1] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="re2_10" class="text-muted">{{ re2_1[2] }}</span><br/><span
                                id="re2">{{ yc[2] }}</span>
                        </h4>
                        </td>
                    </tr>
                    {# F1 加工#}
                    <tr>
                        <td><h4><a class="label label-primary" href="/pos/加工_分立/day/0/factory/1">F1加工出口</a></h4></td>
                        <td><h4><span id="ng_11" class="text-muted">{{ ng_1[0] }}</span><br/><span
                                id="ng_1">{{ ng[0] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="re2_12" class="text-muted">{{ ng_1[1] }}</span><br/><span
                                id="ng_2">{{ ng[1] }}</span>
                        </h4>
                        </td>
                        <td><h4><span id="re2_10" class="text-muted">{{ ng_1[2] }}</span><br/><span
                                id="ng">{{ ng[2] }}</span>
                        </h4>
                        </td>
                    </tr>
                </table>
            </div>

            {#----------------------------------------------------分割线--------------------------------------------------#}
            {#工厂2#}
            <div class="col-lg-6 col-md-6, col-sm-12">
                <table class="table table-condensed">
                    <caption><h4><span class="label label-info">工厂2</span></h4></caption>
                    <tr>
                        <th>工序</th>
                        <th>白班</th>
                        <th>夜班</th>
                        <th>总数</th>
                    </tr>
                    {#  分离：F2铸造1-10#}
                    <tr>
                        <td><h4><a class="label label-success" href="/pos/铸造1线/day/0/factory/2">F2_铸造1-10_出口</a></h4>
                        </td>
                        <td><h4><span id="f2_zz2_11" class="text-muted">{{ f2_yesterday['zz2_1'][0] }}</span><br/><span
                                id="f2_zz2_1">{{ f2_today['zz2'][0] }}</span></h4>
                        </td>
                        <td><h4><span id="f2_zz2_12" class="text-muted">{{ f2_yesterday['zz2_1'][1] }}</span><br/><span
                                id="f2_zz2_2">{{ f2_today['zz2'][1] }}</span></h4>
                        </td>
                        <td><h4><span id="f2_zz2_10" class="text-muted">{{ f2_yesterday['zz2_1'][2] }}</span><br/><span
                                id="f2_zz2">{{ f2_today['zz2'][2] }}</span>
                        </h4></td>
                    </tr>
                    {#  分离：F2铸造11-20#}
                    <tr>
                        <td><h4><a class="label label-success" href="/pos/铸造1线/day/0/factory/2">F2_铸造11-20_出口</a></h4>
                        </td>
                        <td><h4><span id="f2_zz1_11" class="text-muted">{{ f2_yesterday['zz1_1'][0] }}</span><br/><span
                                id="f2_zz1_1">{{ f2_today['zz1'][0] }}</span></h4>
                        </td>
                        <td><h4><span id="f2_zz1_12" class="text-muted">{{ f2_yesterday['zz1_1'][1] }}</span><br/><span
                                id="f2_zz1_2">{{ f2_today['zz1'][1] }}</span></h4>
                        </td>
                        <td><h4><span id="f2_zz1_10" class="text-muted">{{ f2_yesterday['zz1_1'][2] }}</span><br/><span
                                id="f2_zz1">{{ f2_today['zz1'][2] }}</span>
                        </h4></td>
                    </tr>
                    {#  分离：F2热处理 #}
                    <tr>
                        <td><h4><a class="label label-success" href="/pos/F2_热处理/day/0/factory/2">F2_热处理_入口</a></h4>
                        </td>
                        <td><h4><span id="f2_re3_11" class="text-muted">{{ f2_yesterday['re3_1'][0] }}</span><br/><span
                                id="f2_re3_1">{{ f2_today['re3'][0] }}</span></h4>
                        </td>
                        <td><h4><span id="f2_re3_12" class="text-muted">{{ f2_yesterday['re3_1'][1] }}</span><br/><span
                                id="f2_re3_2">{{ f2_today['re3'][1] }}</span></h4>
                        </td>
                        <td><h4><span id="f2_re3_10" class="text-muted">{{ f2_yesterday['re3_1'][2] }}</span><br/><span
                                id="f2_re3">{{ f2_today['re3'][2] }}</span>
                        </h4></td>
                    </tr>
                    {#  分离：F2加工 #}
                    <tr>
                        <td><h4><a class="label label-success" href="/pos/F2_加工_分立/day/0/factory/2">F2_加工_出口</a></h4>
                        </td>
                        <td><h4><span id="f2_njg_11" class="text-muted">{{ f2_yesterday['njg_1'][0] }}</span><br/><span
                                id="f2_njg_1">{{ f2_today['njg'][0] }}</span></h4>
                        </td>
                        <td><h4><span id="f2_njg_12" class="text-muted">{{ f2_yesterday['njg_1'][1] }}</span><br/><span
                                id="f2_njg_2">{{ f2_today['njg'][1] }}</span></h4>
                        </td>
                        <td><h4><span id="f2_njg_10" class="text-muted">{{ f2_yesterday['njg_1'][2] }}</span><br/><span
                                id="f2_njg">{{ f2_today['njg'][2] }}</span>
                        </h4></td>
                    </tr>
                </table>
            </div>
        </div>
    </div>

    {#    <button id="emit">发射</button>#}
</div>
<script src="/static/js/jquery.min.js"></script>
<script src="/static/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/static/js/socket.min.io.js"></script>
<script type="text/javascript">
    var count = 0;
    $("document").ready(function () {
        // 定时切换tab
        function tab_switch() {
            console.log("Tab 索引：" + count);
            if ($("#slider").is(":checked")) return;
            if (count === 0)
                $("#tab_centralize").trigger("click");
            else
                $("#tab_discrete").trigger("click");
            count++;
            if (count >= 2)
                count = 0;
        }

        setInterval(tab_switch, 10000);
        // 事件
        $("#btn_jg").click(function () {
            socket.emit("evt_detail", {type: $("#btn_jg").val()});
        });
        $("#emit").click(function () {
            socket.emit("evt_index", {factory: 2, xy: 1000, jg: 2000});
            {#console.log({factory: 2, xy: 1000, jg: 2000});#}
        });

        let socket = io.connect('http://' + document.domain + ':' + location.port);
        socket.on('index_data', function (data) {
            console.log(data);
            // 循环
            let prefix = '#'; //工厂前缀
            for (let item in data) {
                let new_num;
                if (data.hasOwnProperty(item))
                    new_num = data[item];
                else
                    continue;
                // 更新不同的工厂数据
                if (data['factory'] === 2)
                    prefix = '#f2_';
                else
                    prefix = '#';
                {#console.log('后缀：' + prefix);#}

                // 页面元素不存在，skip
                if ($(prefix + item).length <= 0) {
                    {#console.log('忽略：' + prefix + item);#}
                    continue;
                }
                // 更新 总数
                $(prefix + item).html(new_num);
                // 更新 白班/夜班
                {#console.log(`是白班?${data['is_daytime']}`);#}
                if (typeof(data['is_daytime']) !== 'undefined' && data['is_daytime']) {
                    $(prefix + item + '_1').html(new_num);
                } else {
                    let v_daytime = parseInt($(prefix + item + '_1').html());
                    // 强制刷新
                    if (v_daytime < 0) {
                        location.reload(true);
                    }
                    $(prefix + item + '_2').html(new_num - v_daytime);
                }  // 夜班
            }
        });

        socket.on("refresh", function (data) {
            if (data)
                {#$(location).attr('href', '/');#}
                location.reload(true);
        });
    });
</script>
</body>
</html>